<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			*{
				padding: 0;
				margin: 0;
			}
		</style>
	</head>
	<body>
		<canvas id="mycanvas" width="500px" height="500px"></canvas>		<hr />
		<script type="text/javascript">
				var c =document.getElementById('mycanvas')
				var ctx = c.getContext('2d')
				
				ctx.fillStyle='#ccc'
				
				// 位移，水平、垂直
				ctx.translate(100,50)
				
				ctx.rect(0,0,100,100)
				ctx.fill()
		</script>
	</body>
</html>
